<template>
  <view class="info_container">
      <u-time-line >
		<u-time-line-item nodeTop="2" v-for="(item,index) in express_info_list.Traces" :key="index">
			<!-- 此处自定义了左边内容，用一个图标替代 -->
			<template v-slot:node>
				<!-- <view class="u-node" style="background: #19be6b;">
					<u-icon name="pushpin-fill" color="#fff" :size="24"></u-icon>
				</view> -->
			</template>
			<template v-slot:content>
				<view>
					<!-- <view class="u-order-title">待取件</view> -->
					<view class="u-order-desc">{{item.AcceptStation}}</view>
					<view class="u-order-time">{{item.AcceptTime}}</view>
				</view>
			</template>
		</u-time-line-item>
	</u-time-line>
    <loading 
    ref="loading"
    :custom="false"
    :shadeClick="true"
    :type="1">
        <!-- <view class="test">自定义</view> -->
</loading>
  </view>
</template>

<script>
import { express_info } from "../../utils/imapi";
export default {
  props: {

  },
  components: {

  },
  data() {
    return {
        express_info_list:{}
    };
  },
  computed: {

  },
  watch: {

  },
  onLoad(options) {
      if(options.co) {
           this.get_epxress_info(options.co,options.no)
      }
     
      
  },
  onReady() {
      this.$refs.loading.open();
  },
  onShow() {

  },
  methods: {
        //获取物流信息
   async get_epxress_info(shipperCode,logisticCode) {
     try {
       const data = await express_info({
         shipperCode,
         logisticCode
       })
       if(data.code==0) {
         let date = new Date()
           this.express_info_list=JSON.parse(data.data).Traces.length==0?{Traces:[{AcceptStation:'暂无快递信息'}]}:JSON.parse(data.data)
           console.log(this.express_info_list);
  
           this.$refs.loading.close()
       }
     } catch (error) {
       
     }
    },
  },
  onReachBottom () {

  },
  onHide () {

  },
};
</script>

<style scoped lang="scss" >
.info_container {
    padding-top: 30rpx;
    padding: 30rpx 30rpx;
}
.u-time-axis {
    padding-left: 80rpx;
}
.u-node {
		width: 44rpx;
		height: 44rpx;
		border-radius: 100rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #d0d0d0;
	}
	
	.u-order-title {
		color: #333333;
		font-weight: bold;
		font-size: 32rpx;
	}
	
	.u-order-desc {
		color: rgb(150, 150, 150);
		font-size: 28rpx;
		margin-bottom: 6rpx;
	}
    .u-time-axis-item:last-child .u-order-desc ,.u-time-axis-item:last-child .u-order-time{
        color: #000;
    }
	
	.u-order-time {
		color: rgb(200, 200, 200);
		font-size: 26rpx;
	}
</style>
